<div class="da-list-wrap">
  <div class="da-content-banner">
  <d-breadcrumb>
    <d-breadcrumb-item><a routerLink="/">{{ 'basicdata.breadcrumb.home' | translate }}</a></d-breadcrumb-item>
    <d-breadcrumb-item><a routerLink="/pages/basicdata/material">{{ 'basicdata.breadcrumb.material' | translate }}</a></d-breadcrumb-item>
    <d-breadcrumb-item>{{ 'basicdata.breadcrumb.editMaterial' | translate }}</d-breadcrumb-item>
  </d-breadcrumb>
</div>
<div class="da-content-wrapper">

          <div class="card">
            <div class="card-title">
              <p class="form-title">更新物料</p>
            </div>
            <form dForm ngForm [layout]="layoutDirection" [labelSize]="'sm'"[labelAlign]="'end'" class="mt-5" (dSubmit)="submit($event)">
              <div class="form-body">
                <div>
                  <h4>基础信息</h4>
                </div>
                <div class="grid mt-3">
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label"><span class="Required">*</span>物料编码</span>
                      </d-form-label>
                      <d-form-control>
                        <input dTextInput class="form-input-box" name="code" [(ngModel)]="this.Material.partNum" [dValidateRules]="MaterialRules.partNum">
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label"><span class="Required">*</span>物料名称</span>
                      </d-form-label>
                      <d-form-control>
                        <input dTextInput class="form-input-box" name="name" [(ngModel)]="this.Material.partName" [dValidateRules]="MaterialRules.partName">
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">英文名称</span>
                      </d-form-label>
                      <d-form-control>
                        <input dTextInput class="form-input-box" name="EnName" [(ngModel)]="this.Material.englishName" [dValidateRules]="MaterialRules.englishName">
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label"><span class="Required">*</span>物料规格</span>
                      </d-form-label>
                      <d-form-control>
                        <input dTextInput class="form-input-box" name="partType" [(ngModel)]="this.Material.partType" [dValidateRules]="MaterialRules.partType">
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">助记码</span>
                      </d-form-label>
                      <d-form-control>
                        <input dTextInput class="form-input-box" name="mnemonicCode" [(ngModel)]="this.Material.mnemonicCode" [dValidateRules]="MaterialRules.mnemonicCode">
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label"><span class="Required">*</span>物料类别</span>
                      </d-form-label>
                      <d-form-control>
                        <d-cascader
                          [options]="options"
                          [trigger]="'hover'"
                          [showPath]="true"
                          [allowClear]="true"
                          [dropdownWidth]="130"
                          [(ngModel)]="this.option"
                          (ngModelChange)="CascaderonChanges($event)"
                          name="partClassCode" [dValidateRules]="MaterialRules.partClassid"
                      ></d-cascader>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">仓库名称</span>
                      </d-form-label>
                      <d-form-control>
                        <d-select [options]="allWarehouses" [valueKey]="'warehouseId'" [filterKey]="'warehouseName'" (valueChange)="wareHouseChanges($event)" name="ware" [(ngModel)]="Material.warehouseID">
                        </d-select>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">仓位名称</span>
                      </d-form-label>
                      <d-form-control>
                        <d-select [options]="allPositions" [valueKey]="'positionId'" [filterKey]="'positionName'" (valueChange)="PositionChanges($event)"
                        name="position" [(ngModel)]="Material.positionID" >
                        </d-select>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">默认供应商</span>
                      </d-form-label>
                      <d-form-control>
                        <input dTextInput class="form-input-box" name="供应商" readonly (click)="selectSupplier()" [(ngModel)]="Material.supplyName">
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <div class="u-1-2">
                      <d-form-item>
                        <d-form-label>
                          <span class="label">是否检验</span>
                        </d-form-label>
                        <d-form-control>
                          <d-toggle name="isInspection" [(ngModel)]="Material.isInspection"></d-toggle>
                        </d-form-control>
                      </d-form-item>
                    </div>
                  </div>
                </div>
                <div>
                  <h4>计量单位</h4>
                </div>
                <div class="grid mt-3">

                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label"><span class="Required">*</span>物料单位</span>
                      </d-form-label>
                      <d-form-control>
                        <d-select  [options]="allUnits"  [valueKey]="'entryName'" [filterKey]="'entryName'"  name="物料单位" [(ngModel)]="Material.partUOM" [dValidateRules]="MaterialRules.partUOM">
                        </d-select>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">成本价</span>
                      </d-form-label>
                      <d-form-control>
                        <d-input-number  class="input-number" name="costPrice" [(ngModel)]="Material.costPrice" [min]="0" ></d-input-number>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">销售价</span>
                      </d-form-label>
                      <d-form-control>
                        <d-input-number  class="input-number" name="salePrice" [(ngModel)]="Material.salePrice" [min]="0"></d-input-number>
                      </d-form-control>
                    </d-form-item>
                  </div>
                </div>
                <div>
                  <h4>库存预警</h4>
                </div>
                <div class="grid mt-3">
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">最低库存</span>
                      </d-form-label>
                      <d-form-control>
                        <d-input-number  class="input-number" name="minimumStock"  [(ngModel)]="Material.minimumStock" [allowEmpty]="true"></d-input-number>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">最高库存</span>
                      </d-form-label>
                      <d-form-control>
                        <d-input-number  class="input-number" name="maximumStock"  [(ngModel)]="Material.maximumStock" [allowEmpty]="true" ></d-input-number>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">安全库存</span>
                      </d-form-label>
                      <d-form-control>
                        <d-input-number  class="input-number" name="safetyInventory"  [(ngModel)]="Material.safetyInventory" [allowEmpty]="true"></d-input-number>
                      </d-form-control>
                    </d-form-item>
                  </div>
                </div>
                <div>
                  <h4>其他</h4>
                </div>
                <div class="grid mt-3">
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">物料图片</span>
                      </d-form-label>
                      <d-form-control>
                        <ng-container *ngIf="fileUploaders.length > 0">
                          <div *ngFor="let fileUploader of fileUploaders let i = index"
                          class="devui-add-images">
                            <div
                              class="devui-add-items {{ fileUploader.status === 3 ? 'devui-upload-failed' : '' }}
                              {{ fileUploader.status === 2 ? 'devui-upload-success' : '' }}"
                              >
                              <span class="filename">{{ fileUploader.file.name }}</span>
                              <div *ngIf="fileUploader.status === 1" class="devui-loading">
                                <d-progress [percentage]="fileUploader.percentage" [height]="'5px'" [strokeColor]="'#50D4AB'"></d-progress>
                                <span (click)="deleteFile(fileUploader)" class="devui-cancel-upload">{{ CANCELUPLOAD }}</span>
                              </div>
                              <img  *ngIf="fileUploader.status === 2 || fileUploader.status === 3" [src]=getImagesArray(this.Material.fileURL)[i]>
                            </div>
                            <span class="icon icon-delete {{ fileUploader.status === 3 ? 'devui-failed-icon' : '' }}" (click)="deleteFile(fileUploader)"></span>
                            <span *ngIf="fileUploader.status === 3" class="icon icon-running" (click)="dUpload.uploadFiles()" ()></span>
                          </div>
                        </ng-container>
                        <div
                          dUpload
                          #dUpload="dUpload"
                          class="devui-add-images devui-upload {{ isDropOver ? 'devui-upload-dropover' : '' }}"
                          [enableDrop]="true"
                          [fileOptions]="fileOptions"
                          [uploadOptions]="uploadOptions"
                          [uploadedFiles]="uploadedFiles"
                          [fileUploaders]="fileUploaders"
                          (successEvent)="onSuccess($event)"
                        >
                          <span class="icon-op-add"></span>
                        </div>
                        <d-toast [value]="message"></d-toast>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">物料附件</span>
                      </d-form-label>
                      <d-form-control>
                        <d-badge [count]="gerFileNum(Material.addFileURL)">
                          <d-button bsStyle="common" (btnClick)="onButtonClick()"><i class="icon icon-upload me-2"></i><span>附件</span></d-button>
                        </d-badge>
                      </d-form-control>
                    </d-form-item>
                  </div>
                  <div class="u-1-2">
                    <d-form-item>
                      <d-form-label>
                        <span class="label">备注</span>
                      </d-form-label>
                      <d-form-control>
                        <textarea dTextarea class="textarea" [(ngModel)]="this.Material.description" name="description"></textarea>
                      </d-form-control>
                    </d-form-item>
                  </div>
                </div>
              </div>
              <d-form-operation>
                <d-button bsStyle="primary" dFormSubmit >确定</d-button>
                <d-button class="ms-3" bsStyle="common" (btnClick)="cancle()">取消</d-button>
              </d-form-operation>
            </form>
          </div>

</div>
</div>
<d-toast [value]="msg" [life]="2000" [styleClass]="'custom-class'" [style]="{ left: '50%',top:'10px' }"></d-toast>

